﻿
$(document).ready(function () {
    $('.nav li a').on('click', function () {
        $(this).parent().parent().find('.active').removeClass('active');
        $(this).parent().addClass('active').addClass('active');
        //$('#gsif_sidemenu li').remove();
    });
});

$(function () {
    // Get all events on the current month
    var today = new Date();
    GetEventsOnMonth(today.getFullYear(), today.getMonth() + 1);

    // Load the calender
    $("#gsifcalender").datepicker({
        showWeek: true,
        beforeShowDay: function (date) {
            return HighlightEventDate(date);
        },
        onSelect: function (dateText) {
            DateSelected(dateText)
        },
        onChangeMonthYear: function (year, month, inst) {
            GetEventsOnMonth(year, month);
        }
    });

    // Set calender to swedish
    $("#datepicker").datepicker($.datepicker.regional["sv"]);

    // Make request to show today's events
    ShowToday();
});

// Shows today's events
function ShowToday() {
    var date = new Date();
    date = DateToYMD(date.getFullYear(), date.getMonth() + 1, date.getDate());
    DateSelected(date);
}

// Global variable to keep track of the events the current selected month
var eventsOnMonth = [];

function GetEventsOnMonth(year, month) {

    // Make ajax request to get all events for the month.
    // Make it synchronyously to force the events to be loaded before calender is loaded the first time
    $.ajax({
        url: '/Calender/AjaxGetEventsOnMonth',
        type: 'POST',
        data: {
            year: year,
            month: month
        },
        success: function (calenderEvents) {
            eventsOnMonth = calenderEvents;
        },
        error: function (xhr, err) {
            alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
            alert("responseText: " + xhr.responseText);
        },
        async: false
    });
}

// Returns an array with css class to highlight the date
function HighlightEventDate(date) {
    var result = [true, '', null];
    if (eventsOnMonth.length > 0) {
        var matching = $.grep(eventsOnMonth, function (event) {
            var dateFromServer = new Date(parseInt(event.Date.substr(6)));
            if (dateFromServer.valueOf() == date.valueOf()) {
                return true;
            }
            else {
                return false;
            }
        });

        if (matching.length == 1) {
            if (matching[0].TypeOfEvent == 0) // Match
                result = [true, 'match', null];
            else if (matching[0].TypeOfEvent == 1) // Training
                result = [true, 'training', null];
            else if (matching[0].TypeOfEvent == 2) // Other
                result = [true, 'other', null];
        }
        else if (matching.length > 1) {
            var containsMatch = ContainsEventType(matching, 0);
            var containsTraining = ContainsEventType(matching, 1);
            var containsOther = ContainsEventType(matching, 2);

            if (containsMatch && containsTraining && containsOther)
                result = [true, 'matchAndTrainingAndOther', null];
            else if (containsMatch && containsTraining)
                result = [true, 'matchAndTraining', null];
            else if (containsMatch && containsOther)
                result = [true, 'matchAndOther', null];
            else if (containsTraining && containsOther)
                result = [true, 'trainingAndOther', null];
        }

        return result;
    }
    else {
        return result;
    }
}

function ContainsEventType(events, eventType) {
    var eventsWithEventsType = $.grep(events, function (event) {
        if (event.TypeOfEvent == eventType)
            return true;
        else
            return false;
    });

    if (eventsWithEventsType.length > 0)
        return true;
    else
        return false;
}

//// When a date is selected. Set a loading gif animation, and make an asynchron request for events the selected date
//function DateSelected(dateText) {
//    $("#calenderInfo").html('<img src="/Images/SiteImages/ajax-loader.gif" />');

//    var selectedDate = new Date(dateText);
//    var myUrl = '/Calender/AjaxGetEventsOnDate';
//    var year = selectedDate.getFullYear();
//    var month = selectedDate.getMonth() + 1;
//    var day = selectedDate.getDate();

//    $.post(myUrl,
//        {
//            year: year,
//            month: month,
//            day: day
//        },
//        function (calenderEvents) {
//            // Ta bort animation
//            $("#calenderInfo").html('');
//            $('#calenderInfo').append('<b>Aktiviteter: ' + DateToYMD(year, month, day) + '</b>');
//            $('#calenderInfo').append('<br/><br/>');

//            // Lägg till texten för varje event
//            $.each(calenderEvents, function (i, calenderEvent) {
//                $('#calenderInfo').append(calenderEvent.Text)
//                                  //<%if (Model.LoggedInPlayer != null && Model.LoggedInPlayer.AllowedToWebRed()) {%>
//                                  //.append('<br><a href= "/Calender/Delete/' + calenderEvent.Id + '/' + calenderEvent.TypeOfEvent + '"</a>' + 'Ta bort')
//                                  //.append('<a href= "/Calender/Edit/' + calenderEvent.Id + '/' + calenderEvent.TypeOfEvent + '"</a>' + ' Ändra')
//                                  //<%} %>
//                                  .append('<br><br>');
//            });
//        });
//}

// Returns a string formated as yyyy-MM-dd
function DateToYMD(year, month, day) {
    return '' + year + '-' + (month <= 9 ? '0' + month : month) + '-' + (day <= 9 ? '0' + day : day);
}


jQuery.ajaxSetup({ async: false });
$.post(myUrl,
    {
        year: year,
        month: month,
    },
    function (calenderEvents) {
        eventsOnMonth = calenderEvents;
    });
jQuery.ajaxSetup({ async: true });